<!DOCTYPE html>
<html class="x-admin-sm">

    <head>
        <meta charset="UTF-8">
        <title>派车管理</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="../../static/css/font.css">
        <link rel="stylesheet" href="../../static/css/xadmin.css">

        <script src="../../static/js/jquery.min.js"></script>

        <link rel="stylesheet" href="../../static/lib/layui/css/layui.css" media="all">
        <script type="text/javascript" src="../../static/lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="../../static/js/xadmin.js"></script>
        <script src="../../static/lib/layui/transfer.js"></script>
        <!--       // <script src="static/lib/layui/lay/modules/transfer.js"></script>-->
        <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
        <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
            <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>

    </head>

    <body>
        <div class="layui-fluid">
            <div class="layui-row">
                <table>
                    <tr>
                        <td style="width: 600px"><form class="layui-form" id="paiche">
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red">*</span>用车人</label>
                        <!--<div class="layui-input-inline">
                            <input type="text"  id="useMan" name="useMan" class="layui-input">
                        </div>-->
                        <div class="layui-input-inline">
                            <select id="driverName" name="driverName" class="valid" style="width: 300px" lay-filter="myselect"  lay-search>
                                <option value="" >请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red">*</span>用车人部门</label>
                       <!-- <div class="layui-input-inline">
                            <input type="text"  id="department" name="department" class="layui-input">
                        </div>-->
                        <div class="layui-input-inline">
                            <select id="department" name="department" style="width: 300px" class="valid" lay-filter="myselect1">
                                <option>请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red">*</span>事由去向</label>
                        <div class="layui-input-inline">
                            <input type="text"  id="cause" name="cause" style="width: 300px" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red"></span>人数</label>
                        <div class="layui-input-inline">
                            <input type="text"  id="man" name="man" style="width: 300px" class="layui-input"></div>
                    </div>

                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red"></span>载重</label>
                        <div class="layui-input-inline">
                            <input type="text"  id="weight" name="weight" style="width: 300px" class="layui-input"></div>
                    </div>
                    <!--<div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red">*</span>车牌号</label>
                        <div class="layui-input-inline">
                            <select id="carId" name="carId" class="valid" style="width: 300px" lay-search>
                                <option value="" style="width: 300px">请选择</option>

                            </select>
                        </div>
                    </div>-->
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red">*</span>驾驶员姓名</label>
                        <div class="layui-input-inline">
                            <select id="driverId" name="driverId" style="width: 300px" lay-search="">
                                <option value="" style="width: 300px">请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red">*</span>开车时间</label>
                        <input type="text" id="driveTime" name="driveTime" class="layui-input" style="width: 300px" required="">
                    </div>

                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red"></span>目的地</label>
<!--                            <input type="text" id="destination" name="destination" class="layui-input" style="width: 300px" ng-model="entity.destination">-->
                        <div class="layui-input-inline">
                            <select id="destination" name="destination" style="width: 300px" lay-search="">
                                <option value="" style="width: 300px">请选择</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="" class="layui-form-label">
                            <span class="x-red"></span>出场前里程表指数</label>
                        <div class="layui-input-inline">
                            <input type="text" id="goMileage" style="width: 300px" name="goMileage" class="layui-input"></div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class="x-red"></span>回场后里程表指数</label>
                        <div class="layui-input-inline">
                            <input type="text" id="comeMileage" style="width: 300px" name="comeMileage"  class="layui-input">
                        </div>
                    </div>
            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red"></span>行驶里程</label>
                <div class="layui-input-inline">
                    <input type="text" id="mileage" name="mileage" style="width: 300px" class="layui-input"></div>
            </div>
            <!--<div class="layui-form-item">
                <label for="" class="layui-form-label">
                    <span class="x-red">*</span>派车人</label>
                <div class="layui-input-inline">
                    <input type="text" id="comMander" name="comMander" required=""  lay-verify="required" autocomplete="off" class="layui-input"></div>
            </div>-->
            <!--<div class="layui-form-item">
                <label for="" class="layui-form-label">
                    <span class="x-red">*</span>审核领导</label>
                <div class="layui-input-inline">
                    <input type="text" id="auditLeaderShip" name="auditLeaderShip" required=""  lay-verify="required" autocomplete="off" class="layui-input"></div>
            </div>-->
            <div class="layui-form-item">
                <label for="" class="layui-form-label">
                    <span class="x-red"></span>回场时间</label>
                <div class="layui-input-inline">
                    <input type="text" id="returnTime" style="width: 300px" name="returnTime" class="layui-input"></div>
            </div>
            <div class="layui-form-item layui-form-text">
                <label for="" class="layui-form-label">备注</label>
                <div class="layui-input-block">
                    <textarea placeholder="请输入内容" id="remark" name="remark" style="width: 300px"  class="layui-textarea"></textarea>
                </div>
            </div>
        <div class="layui-form-item">
            <label for="" class="layui-form-label"></label>
<!--            <button class="layui-btn"  id="add" lay-filter="add" lay-submit="">保存</button>-->
            <button type="button" class="layui-btn" lay-demotransferactive="getData">保存</button>
        </div>
        </form>
                        </td>
                        <td style="width: 600px;height:300px;top: 10px">
                            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
                                <legend>车辆列表</legend>
                            </fieldset>
                            <div class="layui-btn-container">
<!--                                <button type="button" class="layui-btn" lay-demotransferactive="getData">获取右侧数据</button>-->
                            </div>
                            <div id="car" class="demo-transfer" style="width: 600px;height:300px;top: 10px"></div>
                        </td>
                    </tr>
                </table>
        </div>
        </div>
        <script type="text/javascript">
            layui.use(['layer','form'], function() {
                var form = layui.form;
                var layer = layui.layer;
                    form.on('select(myselect)', function(data){
                        console.log(data.value);
                        var driveName=data.value;
                        $.ajax({
                            type: 'POST',
                            url: '/paiche/mantodept/'+driveName,
                            dataType:  'json',
                            success: function(data){
                                var department=data.data[0].t_department;
                                console.log(department);
                                //检查项目添加到下拉框中
                                $.ajax({
                                    url: '/useMan/tdriverDepartment',
                                    dataType: 'json',
                                    type: 'get',
                                    success: function (data) {
                                        console.log(data);
                                        $.each(data.data, function (index, item) {
                                            //alert(item.carId)
                                            $('#department').append(new Option(item.departmentName, item.departmentNum));// 下拉菜单里添加元素
                                            $('#department').val(department);
                                        });

                                        //重新渲染 固定写法
                                        layui.form.render("select");
                                    }
                                })
                            }
                        });
                    });


                /* form.render(); */
                //检查项目添加到下拉框中
                $.ajax({
                    url: '/TCar/tcarNo',
                    dataType: 'json',
                    type: 'get',
                    success: function (data) {
                        console.log(data);

                        $.each(data.data, function (index, item) {
                            //alert(item.carId)
                            $('#carId').append(new Option(item.carNo, item.carId));// 下拉菜单里添加元素
                        });

                        //重新渲染 固定写法
                        layui.form.render("select");
                    }
                })

                // 目的地
                $.ajax({
                    url: '/destination/select',
                    dataType: 'json',
                    type: 'get',
                    success: function (data) {
                        console.log(data);

                        $.each(data.data, function (index, item) {
                            //alert(item.carId)
                            $('#destination').append(new Option(item.desName, item.desId));// 下拉菜单里添加元素
                            console.log("",item.desId);
                        });

                        //重新渲染 固定写法
                        layui.form.render("select");
                    }
                })

                // 用车人
                $.ajax({
                    url: '/useMan/tdriverName',
                    dataType: 'json',
                    type: 'get',
                    success: function (data) {
                        console.log(data.data);

                        $.each(data.data, function (index, item) {
                            //alert(item.carId)
                            $('#driverName').append(new Option(item.driverName, item.driverId));// 下拉菜单里添加元素
                        });

                        //重新渲染 固定写法
                        layui.form.render("select");
                    }
                })

                /* form.render(); */
                //检查项目添加到下拉框中
                $.ajax({
                    url: '/TDriver/tdriverName',
                    dataType: 'json',
                    type: 'get',
                    success: function (data) {
                        console.log(data);

                        $.each(data.data, function (index, item) {
                            //alert(item.driverId)
                            $('#driverId').append(new Option(item.driverName, item.driverId));// 下拉菜单里添加元素
                        });

                        //重新渲染 固定写法
                        layui.form.render("select");
                    }
                })

            })

            // 日期处理
            layui.use('laydate', function(){
                var laydate = layui.laydate;

                //执行一个laydate实例
                laydate.render({
                    elem: '#driveTime' //指定元素
                    ,type: 'datetime'
                });

                laydate.render({
                    elem:'#returnTime'
                    ,type:'datetime'
                })
            });

            // 日期转换
            function Format(now,mask) {
                var d = new Date(now);
                var zeroize = function (value, length)
                {
                    if (!length) length = 2;
                    value = String(value);
                    for (var i = 0, zeros = ''; i < (length - value.length); i++)
                    {
                        zeros += '0';
                    }
                    return zeros + value;
                };

                return mask.replace(/"[^"]*"|'[^']*'|\b(?:d{1,4}|m{1,4}|yy(?:yy)?|([hHMstT])\1?|[lLZ])\b/g, function ($0)
                {
                    switch ($0)
                    {
                        case 'd': return d.getDate();
                        case 'dd': return zeroize(d.getDate());
                        case 'ddd': return ['Sun', 'Mon', 'Tue', 'Wed', 'Thr', 'Fri', 'Sat'][d.getDay()];
                        case 'dddd': return ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'][d.getDay()];
                        case 'M': return d.getMonth() + 1;
                        case 'MM': return zeroize(d.getMonth() + 1);
                        case 'MMM': return ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'][d.getMonth()];
                        case 'MMMM': return ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'][d.getMonth()];
                        case 'yy': return String(d.getFullYear()).substr(2);
                        case 'yyyy': return d.getFullYear();
                        case 'h': return d.getHours() % 12 || 12;
                        case 'hh': return zeroize(d.getHours() % 12 || 12);
                        case 'H': return d.getHours();
                        case 'HH': return zeroize(d.getHours());
                        case 'm': return d.getMinutes();
                        case 'mm': return zeroize(d.getMinutes());
                        case 's': return d.getSeconds();
                        case 'ss': return zeroize(d.getSeconds());
                        case 'l': return zeroize(d.getMilliseconds(), 3);
                        case 'L': var m = d.getMilliseconds();
                            if (m > 99) m = Math.round(m / 10);
                            return zeroize(m);
                        case 'tt': return d.getHours() < 12 ? 'am' : 'pm';
                        case 'TT': return d.getHours() < 12 ? 'AM' : 'PM';
                        case 'Z': return d.toUTCString().match(/[A-Z]+$/);
                        // Return quoted strings with the surrounding quotes removed
                        default: return $0.substr(1, $0.length - 2);
                    }
                });
            };

            // 穿梭框  车辆  车牌号  driverId  car
            layui.use(['transfer', 'layer', 'util'], function() {
                //模拟数据
                var data1 = [
                    {"value": "1", "title": "李白"}
                    ,{"value": "2", "title": "杜甫"}
                    ,{"value": "3", "title": "苏轼"}
                    ,{"value": "4", "title": "李清照"}
                    ,{"value": "5", "title": "鲁迅", "disabled": true}
                    ,{"value": "6", "title": "巴金"}
                    ,{"value": "7", "title": "冰心"}
                    ,{"value": "8", "title": "矛盾"}
                    ,{"value": "9", "title": "贤心"}
                ];
                console.log("data1-->"+data1)
                var data2;
                var $ = layui.$
                    , transfer = layui.transfer
                    , layer = layui.layer
                    , util = layui.util;

                $.ajax({
                    type: 'get',
                    url: '/paiche/carno',
                    dataType:  'json',

                    success: function(data){
                        data2=data.data;
                        transfer.render({
                            elem: '#car'
                            ,title: ['待命车辆','已选车辆']
                            ,parseData: function(res){
                                return {
                                    "value": res.value //数据值
                                    ,"title": res.title //数据标题
                                    ,"disabled": res.disabled  //是否禁用
                                    ,"checked": res.checked //是否选中
                                }
                            }
                            ,id: 'demo1'
                            ,data: data2
                            ,height: 500
                        });
                        // $.each(data.data, function (index, item) {
                        //     //alert(item.driverId)
                        //     //$('#driverId').append(new Option(item.driverName, item.driverId));// 下拉菜单里添加元素
                        // });
                    }
                });

                util.event('lay-demoTransferActive', {
                    getData: function(othis){
                        var getData = transfer.getData('demo1'); //获取右侧数据
                        //layer.alert(JSON.stringify(getData));
                        console.log(getData);

                        $(function(){
                            // $("#add").click(function(){
                            //     var getData = transfer.getData('demo1');
                                var driverId=$("#driverId").val();
                                var department = $("#department").val();
                                // var carId=$("#carId").val();
                                var carId=getData[0].value;
                                var driverName=$("#driverName").val();
                                var cause=$("#cause").val();
                                var destination=$("#destination").val();
                                var man=$("#man").val();
                                var weight=$("#weight").val();
                                var driveTime=Format($("#driveTime").val(),"yyyy-MM-dd HH:mm:ss");
                                var goMileage=$("#goMileage").val();
                                var mileage=$("#mileage").val();
                                //var comMander=$("#comMander").val();

                                var returnTime=Format($("#returnTime").val(),"yyyy-MM-dd HH:mm:ss");
                                //var storageTime=Format($("#storageTime").val(),"yyyy-MM-dd HH:mm:ss");
                                var remark=$("#remark").val();
                                console.log("deptId",department);
                                console.log(driverId,department,carId,driverName,cause,destination,man,weight,driveTime,goMileage,mileage,returnTime);
                                $.ajax({
                                    url:"/paiche/add",
                                    type:'POST',
                                    dataType:"JSON",
                                    data: //$("#paiche").serialize()
                                        {
                                            'driverId':driverId,
                                            'carId':carId,
                                            'useMan':driverName,
                                            'cause':cause,
                                            //'status':status,
                                            'destination':destination,
                                            'man':man,
                                            'weight':weight,
                                            'driveTime':driveTime,
                                            'remark':remark,
                                            // 'storageTime':storageTime,
                                            'returnTime':returnTime,
                                            //'comMander':comMander,
                                            'mileage':mileage,
                                            'goMileage':goMileage,
                                            'deptId':department
                                        },
                                    async:false,
                                    success: function(data){
                                        console.log(data);
                                        /* // 获得frame索引
                                        var index = parent.layer.getFrameIndex(window.name);
                                       //关闭当前frame
                                       parent.layer.close(index);  */

                                        alert("恭喜您，派车单保存成功！");

                                        var index = parent.layer.getFrameIndex(window.name),
                                            p = parent;

                                        //然后下面先关闭子窗口
                                        parent.layer.close(index);
                                        //再刷新
                                        p.location.reload();


                                    }
                                // })
                            })


                        })
                    }
                });
            });

        </script>
        <script>
            var _hmt = _hmt || []; (function() {
                var hm = document.createElement("script");
                hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
                var s = document.getElementsByTagName("script")[0];
                s.parentNode.insertBefore(hm, s);
            })();
        </script>
    </body>

</html>
